<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>创建axios实例对象</title>
    <script src="axios.js"></script>
</head>
<body>
<button>发送GET请求</button>
<button>发送POST请求</button>
<button>发送PUT请求</button>
<button>发送DELETE请求</button>
</body>
<script>
    //创建axios实例对象1
    const duanzi = axios.create(
        {
            baseURL: 'http://localhost:3000',
            timeout: 2000,

        }
    )
    //创建axios实例对象2
    const onather = axios.create({
        baseURL: 'http://baidu.com',
        timeout: 2000,
        method: 'GET'

    })

    //使用axios实例对象
    const btn = document.querySelectorAll('button')
    btn[0].addEventListener('click', function () {
        duanzi({
            //请求类型
            method: 'GET',
            //URL
            url: '/posts/2'
        }).then(
            response => {
                console.log(response.data)
            },
            error => {
                console.log(error)
            }
        )
    })


    btn[1].addEventListener('click', function () {
        duanzi.post('/posts', {
            "id": "3",
            "title": "add new title3",
            "views": 300
        }).then(response => {
            console.log(response)
        })
    })


</script>
</html>